<template>
  <view class="container">
    <view class="example">
      <uni-forms ref="form" :model="formData" labelWidth="80px">
        <uni-forms-item label="内部码" name="code" class="item-margin">
          <uni-easyinput v-model="formData.code" placeholder="扫码" focus @confirm="submitForm" />
        </uni-forms-item>
      </uni-forms>
	  <view class="uni-form-item word-wrap">
	  	<view class=""> 扫描数据：{{formData.code}}</view>
	  </view>
    </view>
	
	<view class="table1">
		<uni-table ref="table" border stripe emptyText="暂无数据" class="tableAll">
			<!-- 表格数据行 -->
			<uni-tr>
				<uni-td align="center">内码编号</uni-td>
				<uni-td align="center">{{ queryData.internalCode }}</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">规格</uni-td>
				<uni-td align="center">{{ queryData.flex }}</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">刚性</uni-td>
				<uni-td align="center">{{ queryData.rigidity }}</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">长度</uni-td>
				<uni-td align="center">{{ queryData.len }}</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">造型</uni-td>
				<uni-td align="center">{{ queryData.mould }}</uni-td>
			</uni-tr>
		</uni-table>
	</view>
	
  </view>
</template>

<script>
	import { productQuery } from "@/api/longyi/finishProQuery/Index.js"
	
	export default {
	  data() {
	    return {
		  formData: {
			code: ''
		  },
		  queryData: {
		      flex: '',
		      rigidity: '',
		      len: '',
		      internalCode  : '',
		      mould: ''
		  },
		  loading: false,
	      rules: {
	        internalCode: {
	          rules: [{
	            required: true,
	            errorMessage: '内部码不能为空'
	          }]
	        }
	      }
	    }
	  },
	  onReady() {
	    this.$refs.form.setRules(this.rules)
	  },
	  methods: {
		  submitForm() {
			  productQuery(this.formData).then(response => {
				this.queryData.internalCode = response.data.internalCode
				this.queryData.flex = response.data.flex
				this.queryData.rigidity = response.data.rigidity
				this.queryData.len = response.data.len
				this.queryData.mould = response.data.mould
				// console.log(response.data)
			  })
		  }
	  }
	}
</script>

<style lang="scss">
  .example {
    padding: 15px;
    background-color: #fff;
	margin: 10px auto;
	.item-margin.is-direction-left {
	    margin-bottom: 15px !important;
	}
	.margin0.is-direction-left {
	    margin-bottom: 0 !important;
	}
  }
  .footer-btn{
	  padding: 15px;
	  background-color: #fff;
	  margin-top: 66px;
	  position: fixed;
	  width: 100%;
	  bottom: 0;
  }
  .container {
      overflow: hidden;
  }
</style>